<fieldset >
	<div id="textoSuprimir">
		<p style="font-size: 15px; text-align:left;" >Selecciona el tema y el nivel para ver las preguntas con esas caracteristicas.<br>
			Seleccionar una pregunta. Si se desea borrar la pregunta con sus respuestar pinchar en borrar pregunta.<br>
			Si se desea solamente borrar las respuestas asociadas a una pregunta, seleccionar las preguntar y pinchar en borrar respuestas. 
			
		</p>
	</div>
	<br/>
	<div id="seleccion" class="form-inline" >

			<fieldset>
				<div id="asignatura" class="form-group">
					<label  for="asignaturas" class="col-sm-3 control-label">Tema:</label> 
					<div class="col-sm-3">
						<select id="asignaturas" name="idAsignatura" class="form-control " required>
							<option value="">-- Tema --</option>
						</select>
					</div>
				</div>
				<div id="nivel" class="form-group">
					<label  for="dificultades" class="col-sm-3 control-label">Nivel:</label>
					<div class="col-sm-3">
						<select id="dificultades" name="idDificultad" class="form-control" required>
							<option value="">-- Nivel --</option>
						</select>
					</div>
				</div>
				<input type="button" class="btn btn-primary" value="Buscar Preguntas" id="buscarPreguntas"/>
			</fieldset>
	</div>
		
	<br/>
	<br/>
		
		
	<table id="contenedorPreguntas" class="table table-bordered table-striped table-hover table-responsive">
		<thead>
				<th>Enunciado</th>
		</thead>
	</table>
		
	<br/>
	<br/>
				
		<table class="table table-bordered table-striped table-hover table-responsive" id="contenedorRespuestas">
		
		</table>
	
	<div id="botones">
		
		<input type="button" value="Suprimir Pregunta" id="suprimirPregunta" class="btn btn-primary"/>
		<input type="button" value="Suprimir Respuesta" id="suprimirRespuesta" class="btn btn-primary"/>
	
	</div>
</fieldset>
	
<script>

var idPreguntaSeleccionada=[];
var idRespuestaSeleccionada = [];

//El one sirve para llamarlo solo una vez
$(document).one("ajaxComplete", seleccion);
function seleccion() {

	// Cargar asignatura
	var $asignaturas = $('#asignaturas');
	var urlAsignatura = "../dispatcher/referencias/asignaturas";

	$.getJSON(urlAsignatura, function(datos) {
		$.each(datos, function(i, item) {
			$asignaturas.append('<option value="'+ item.id +'">'
					+ item.nombre + '</option>');
			$asignaturas.append(item.nombre);
		});

	});

	// Cargar dificultades
	var $dificultades = $('#dificultades');
	var urlDificultad = "../dispatcher/referencias/dificultad";

	$.getJSON(urlDificultad, function(data) {
		$.each(data, function(i, item) {
			$dificultades.append('<option value="'+ item.id +'">'
					+ item.label + '</option>')
			$dificultades.append(item.label);
		});

	});

};

$("#buscarPreguntas").click(function() {
	$("#contenedorPreguntas  > tbody > tr").remove();

	var asignatura = $('#asignaturas').val();
	var dificultad = $('#dificultades').val();
	
	var urlPreguntas = "../dispatcher/pregunta/recuperarPreguntas";
	urlPreguntas += "?asignaturaId="+ asignatura + "&dificultadId=" + dificultad;
	$.getJSON(urlPreguntas, function(data) {
	
	$.each(data, function(i, item){
		
		$(contenedorPreguntas).append('<tr id='+ item.id +'> <td>' + item.enunciado + ' </td></tr>');
		});
	
	});
});

$(function() {
	$( "#contenedorPreguntas" ).selectable({
		filter:"tr",
		stop: function() {
		
        idPreguntaSeleccionada=[];
        
        $( ".ui-selected", this ).each(function() {
        	$(this).siblings().removeClass("ui-selected");
        	
	        var index = $( "#contenedorPreguntas tr" ).index( this );
	        var id = $( "#contenedorPreguntas tr")[index].id;	 
				
	        idPreguntaSeleccionada.push(id);
	       
        });
      }
    });
  });	

$("#contenedorPreguntas").click(function(){
	 $("#contenedorRespuestas tr").remove();
	var urlRespuestas = "../dispatcher/respuesta/recuperarRespuestas";
	urlRespuestas += "?preguntaId="+ idPreguntaSeleccionada;

	$.getJSON(urlRespuestas, function(data) {
	
		$.each(data, function(i, item){
			 $(contenedorRespuestas).append('<tr id='+ item.id +'>'
					 						
												+ '<td>' + item.correcta + '</td>'
												+ '<td>' + item.contenidoRespuesta + '</td>'
												+ '</tr>');

		 
			});
	
		});
	
});


$(function() {
	$( "#contenedorRespuestas" ).selectable({
		filter:'tbody tr',
		stop: function() {
			
	        var result = $( "#select-result-respuesta" ).empty();
	        idRespuestaSeleccionada = [];
	        
	        $( ".ui-selected", this ).each(function() {
	        	  $(this).siblings().removeClass("ui-selected");

	           var id = this.id;	 

		          idRespuestaSeleccionada.push(id);
		          
		          result.append( " #" + " id :" +id);
        	});
      }
    });
});

$("#suprimirRespuesta").click(function() {

	
	var urlSuprimirRespuesta = "../dispatcher/respuesta/suprimirRespuesta";
	var json = [];
	$.each(idRespuestaSeleccionada, function(i,id) {
		var bloqueJson = {}
		bloqueJson["id"] = id;
		json.push(bloqueJson);
	});

	$.ajax({
           type: "POST",
           url:urlSuprimirRespuesta,
           data: JSON.stringify(json),
           beforeSend: function(xhr) {  
               xhr.setRequestHeader("Accept", "application/json");  
               xhr.setRequestHeader("Content-Type", "application/json");  
           },  
           success: function (datos) {
        	   if (datos.errorMessage == null) {
               		alert("Respuesta suprimida");
        	   } else {
        		   alert(datos.errorMessage);
        	   }
       },
       error : function (data, status, er) {
       	alert("error" + data + " status " +status+" er:"+er );
       }
	
	});
});


$("#suprimirPregunta").click(function() {

	
	var urlSuprimirPregunta = "../dispatcher/pregunta/suprimirPregunta";
	//urlSuprimirRespuesta += "?respuestaIds="+ idRespuestaSeleccionada;
	var json = [];
	$.each(idPreguntaSeleccionada, function(i,id) {
		var bloqueJson = {}
		bloqueJson["id"] = id;
		json.push(bloqueJson);
	});

	$.ajax({
           type: "POST",
           url:urlSuprimirPregunta,
           data: JSON.stringify(json),
           beforeSend: function(xhr) {  
               xhr.setRequestHeader("Accept", "application/json");  
               xhr.setRequestHeader("Content-Type", "application/json");  
           },  
           success: function (datos) {
        	   if (datos.errorMessage == null) {
               		alert("Pregunta suprimida");
        	   } else {
        		   	alert(datos.errorMessage);
        	   }
       },
       error : function (data, status, er) {
       	alert("error" + data + " status " +status+" er:"+er );
       }
	
	});
});

</script>